<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="css/style.css">
		<script src="js/jq.js"></script>
		<script src="js/slide.js"></script>
	</head>
	<body>
		<div class="container">
			<div class="header header-cont">
				<div class="wrap">
					<div class="header-top">
						<div class="logo">
							<a href="index.html"><img src="img/logo.svg" alt=""></a>
						</div>
						<div class="nav">
							<ul class="clearfix">
								<li>
									<a href="list.html">所有商品</a>
								</li>
								<li><a href="list.html">篮球</a></li>
								<li><a href="list.html">跑步</a></li>
								<li><a href="list.html">新品</a></li>
								<li><a href="list.html">企业团购</a></li>
								<li><a href="list.html">大码鞋</a></li>
								<li><a href="list.html">太极</a></li>
								<li><a href="list.html">秒杀</a></li>
							</ul>
							<div class="subnav">
								<div class="wrap">
									<dl>
										<dt>男鞋</dt>
										<dd><a href="list.html">篮球鞋</a></dd>
										<dd><a href="list.html">篮球鞋</a></dd>
									</dl>
									<dl>
										<dt>男鞋</dt>
										<dd><a href="list.html">篮球鞋</a></dd>
										<dd><a href="list.html">篮球鞋</a></dd>
									</dl>
								</div>
							</div>
						</div>
						<div class="header-top-right">
							<div class="message">
								<ul class="clearfix">
									<li><a id="status" href="login.html">请登录</a></li>
									<li><a href="shop.html">购物车(0)</a></li>
									<li><a href="">我的订单</a></li>
									<li>
										<a href="">网站导航</a>
										<div class="submenu">
											<a href="">匹克官网</a>
											<a href="">俱乐部</a>
											<a href="">PEAK+社区</a>
											<a href="">校服/定制</a>
											<a href="">商品大全</a>
											<a href="">正品验证</a>
											<a href="">服务中心</a>
											<a href="">官店微博</a>

										</div>
									</li>
									<li>
										<a href="">联系客服</a>
										<div class="submenu">
											<a href="">售前</a>
											<a href="">售后</a>
										</div>
									</li>
									<li><a href="JavaScript:;">手机版</a></li>
								</ul>
							</div>
							<div class="search">
								<input type="text" id="test">
								<button id="sbtn"><img src="img/icon-seach.png" alt=""></button>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="main-con">
				<div class="wrap-cont details">
					<div class="path">您当前所在的位置： 首页 > E04258H</div>
					<div class="details-top clearfix">
						<div class="fdj">
							放大镜
						</div>
						<div class="goods">
							<div class="goods-title"></div>
							<div class="goods-price">
								<h4>价格</h4><span>¥<i></i></span>
							</div>
							<!-- <div class="goods-color">
								<ul>
									<li></li>
								</ul>
							</div> -->
							<div class="goods-size">
								<h4>选择尺码</h4>
								<ul>
									<li>34</li>
									<li>35</li>
									<li>36</li>
									<li>37</li>
									<li>38</li>
									<li>39</li>
								</ul>
							</div>
							<div class="goods-number">
								<h4>购买数量</h4>
								<div class="count">
									<button class="sub">-</button>
									<input id="testvalue" type="text" value="1">
									<button class="add">+</button>
								</div>
							</div>
							<div class="goods-select">
								<h4>已选择商品</h4>
							</div>
							<div class="shop">
								<button class="shop-btn">加入购物车</button>
								<button class="collect-btn">喜欢</button>
							</div>
						</div>
					</div>
					<div class="details-bottom">
						<div class="details-cont">
							<div class="details-cont-top">
								<h4>
									详情描述
								</h4>
								<button class="gm">立即购买</button>
							</div>
							<div class="details-cont-bottom">

							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="footer">
				<div class="footer-top">
					<div class="wrap">
						<ul>
							<li>
								<img src="img/foot-icon1.png" alt="">
								<h3>防伪查询</h3>
							</li>
							<li>
								<img src="img/foot-icon2.png" alt="">
								<h3>满99元包邮</h3>
							</li>
							<li>
								<img src="img/foot-icon3.png" alt="">
								<h3>7天无理由退货</h3>
							</li>
							<li>
								<img src="img/foot-icon4.png" alt="">
								<h3>品牌直营</h3>
							</li>
							<li>
								<img src="img/foot-icon5.png" alt="">
								<h3>团购服务</h3>
							</li>
						</ul>
					</div>
				</div>
				<div class="footer-bottom">
					<div class="footer-links">
						<div class="wrap">
							<div class="footer-links-left">
								<dl>
									<dt>购物相关</dt>
									<dd><a href="">新手帮助</a></dd>
									<dd><a href="">购物指南</a></dd>
								</dl>
								<dl>
									<dt>售后服务</dt>
									<dd><a href="">正品验证</a></dd>
									<dd><a href="">退货换货</a></dd>
									<dd><a href="">查看物流</a></dd>
								</dl>
								<dl>
									<dt>会员服务</dt>
									<dd><a href="">关于抵用券</a></dd>
									<dd><a href="">积分规则</a></dd>
								</dl>
								<dl>
									<dt>友情链接</dt>
									<dd><a href="">匹克官网</a></dd>
									<dd><a href="">匹克补货</a></dd>
									<dd><a href="">匹克团购通</a></dd>
									<dd><a href="">匹克校服</a></dd>
									<dd><a href="">匹克品牌</a></dd>
								</dl>
								<dl>
									<dt>服务热线</dt>
									<dd><a href="">售前：0595-2275 0137</a></dd>
									<dd><a href="">售后：400-884-8840</a></dd>
									<dd><a href="">工作日 9:00-23:00(节假日不休息)</a></dd>
								</dl>
							</div>
							<div class="footer-links-right">
								<dl>
									<dt><img src="img/foot-qrcode.jpg" alt=""></dt>
									<dd>匹克官方商城
										微信公众号</dd>
								</dl>
								<dl>
									<dt><img src="img/qrcode.png" alt=""></dt>
									<dd>匹克微服务</dd>
								</dl>
								<dl>
									<dt><img src="img/00.png" alt=""></dt>
									<dd><a href="">立即加入</a></dd>
								</dl>
							</div>
						</div>
					</div>
					<div class="footer-copy">
						<div class="wrap">
							<img src="img/aq.png" alt="">
							<span> Copyright© 2014-匹克网方网店</span>
							<span>版权所有 | 闽ICP备11009488号-1</span>
							<span>移动统计</span>
						</div>
					</div>
				</div>
			</div>
			<div class="f-nav">
				<ul>
					<li>
						<img class="img" src="img/icon-s-item1.png" alt="">
						<img class="h-img" src="img/icon-s-item1-1.png" alt="">
					</li>
					<li>
						<img src="img/icon-s-item2.png" alt="">
						<a href="">购<br />物<br />车</a>
					</li>
					<li class="tbs">
						<img src="img/icon-s-item9.png" alt="">
						<a href="">优惠<br />券</a>
					</li>
					<li class="tbs">
						<img src="img/icon-s-item3.png" alt="">
						<a href="">我的<br />收藏</a>
					</li>
					<li class="tbs">
						<img src="img/icon-s-item5.png" alt="">
						<a href="">网站<br />客服</a>
					</li>
					<li class="top">
						<img src="img/icon-s-item8.png" alt="">
					</li>
				</ul>
			</div>
		</div>
	</body>
</html>
<script>
	// 获取cookie函数
	function getCookie(key) {
		let cookie = document.cookie;
		let arr = cookie.split("; ");
		let result = {}
		arr.forEach(item => {
			let key = item.split("=")[0];
			let value = item.split("=")[1];
			result[key] = value;
		})
		if (key) {
			return result[key];
		}
		return result;
	}
	if (getCookie("username")) {
		$("#status").html(getCookie("username") + "," + "已登录")
	} else {
		$("#status").html("请登录");
		$(".shop-btn").attr("disabled", "disabled").css({
			"background": "#e5e5e5"
		})
	}
</script>
<script>
	$(function() {
		$(".nav ul li,.subnav").hover(function() {
			$(".subnav").toggle()
		})
		$(".top").click(function() {
			$("html").animate({
				scrollTop: 0
			}, 300)
		})
		$(window).scroll(function() {
			if ($(document).scrollTop() === 0) {
				$(".f-nav").stop().animate({
					right: "-40px"
				}, 200)
			} else {
				$(".f-nav").stop().animate({
					right: "0px"
				}, 200)
			}
		})

		$(".add").click(function() {
			let count = Number($("#testvalue").val())
			count++;
			$("#testvalue").val(count)
		})
		$(".sub").click(function() {
			let count = Number($("#testvalue").val())
			if ($("#testvalue").val() === "1") {
				return;
			}
			count--;
			$("#testvalue").val(count)
		})
	})
</script>
<script>
	let url = window.location.search;
	let gid = url.replace("?id=", "");
	console.log(gid)
	$.ajax({
		url: `http://10.35.164.178:8080/goodsItem`,
		data: {
			id: url.replace("?id=", "")
		},
		success(data) {
			let test = JSON.parse(data)
			$(".goods-title").html(test[0].title);
			$(".goods-price i").html(test[0].price)
			$(".details-cont-bottom").html(test[0].details)
		}
	})

	$(".shop-btn").click(function() {
		if (getCookie("id")) {
			$.ajax({
				url: 'http://10.35.164.178:8080/insert',
				data: {
					id:url.replace("?id=", ""),
					goodsID: url.replace("?id=", ""),
					userID: getCookie("id"),
					number: $("#testvalue").val(),
					key:"number",
					value:$("#testvalue").val()
				},
				success(data) {
					alert("购物车添加成功")
				}
			})
			
		}
	})
	// 设置cookie函数
	function setCookie(key, value, expires) {
		if (typeof expires === "number") {
			let date = new Date();
			date.setMinutes(date.getMinutes() + (expires - 8 * 60))
			document.cookie = `${key}=${value};expires=${date}`;
		} else {
			document.cookie = `${key}=${value};expires=${expires}`;
		}
	}
</script>
